<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
        <meta name="format-detection" content="telephone=no, address=no, email=no">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="apple-mobile-web-app-status-bar-style" content="black" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
		<title>私人定制-购买</title>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="fonts/iconfont.css"/>
	</head>
	<body class="body-gray">
		<!--公用头部-->
		<div class="headwrap">
			<div class="head-top clearfix">
				<div class="logo">
					<a href="javascript:void(0)">
						<img src="images/logo.png" alt="" />
					</a>
				</div>
				<div class="btn-nav">
					<a href="javascript:void(0)"><i></i></a>
				</div>
			</div>
			<div class="order-title">
				<i class="iconfont icon-zuojiantou"></i>
				<h2>订单支付</h2>
			</div>
		</div>
		
	    
	    <!--主体内容-->
	    <div class="identical-purchase-content">
	    	<h2>私人定制作品</h2>
	    	<ul>
	    		<li>
	    			<h3>拍摄信息</h3>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">拍摄地</div>
	    			<div class="right">北京<i class="iconfont icon-youjiantou1"></i></div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">拍摄档期</div>
	    			<div class="right">
	    				<input class="time" type="date" name="" id="time" placeholder="选择时间" />
	    				<i class="iconfont icon-youjiantou1"></i>
	    			</div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">备注</div>
	    			<div class="right" data-toggle="modal" data-target=".bs-example-modal-bz" onclick="return false;"><i class="iconfont icon-youjiantou1"></i></div>
	    		</li>
	    	</ul>
	    	<ul>
	    		<li>
	    			<h3>作品信息</h3>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">导演</div>
	    			<div class="right">名字<i class="iconfont icon-youjiantou1"></i></div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">编剧</div>
	    			<div class="right">名字<i class="iconfont icon-youjiantou1"></i></div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">作品类型</div>
	    			<div class="right" data-toggle="modal" data-target=".bs-example-modal-p-worksType" onclick="return false;">
	    				<span class="resume">婚恋简历</span><i class="iconfont icon-youjiantou1"></i>
	    			</div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">套餐类型</div>
	    			<div class="right">套餐B</div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">套餐内容</div>
	    			<div class="right">待定</div>
	    		</li>
	    	</ul>
	    	<ul>
	    		<li>
	    			<h3>优惠券信息</h3>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">优惠券</div>
	    			<div class="right" data-toggle="modal" data-target=".bs-example-modal-yhq" onclick="return false;">10元优惠券<i class="iconfont icon-youjiantou1"></i></div>
	    		</li>
	    	</ul>
	    	<ul>
	    		<li>
	    			<h3>发票信息</h3>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">是否需要发票</div>
	    			<div class="right" data-toggle="modal" data-target=".bs-example-modal-p-fp" onclick="return false;">
	    				<span class="invoice">是</span><i class="iconfont icon-youjiantou1"></i>
	    			</div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">发票抬头</div>
	    			<div class="right" data-toggle="modal" data-target=".bs-example-modal-tt" onclick="return false;">公司<i class="iconfont icon-youjiantou1"></i></div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">收票人信息</div>
	    			<div class="right" data-toggle="modal" data-target=".bs-example-modal-spr" onclick="return false;">王西西 北京市海淀区<i class="iconfont icon-youjiantou1"></i></div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">发票内容</div>
	    			<div class="right">发票内容发票内容发票内容发票内容发票内容</div>
	    		</li>
	    		<li class="clearfix">
	    			<div class="left">发票金额</div>
	    			<div class="right">￥2000.00元</div>
	    		</li>
	    	</ul>
	    </div>
	    
	    <div class="private-bottom-nav identical-bottom-nav clearfix">
			<div class="left">
				<i></i>
				<div class="name">
					<p>短视频购买协议</p>
				</div>
			</div>
			<div class="right">
				<p>应付金额：￥2000</p>
				<a href="javascript:void(0)">提交订单</a>
			</div>
		</div>
		
		
		<!--备注模态窗-->
		<div class="modal fade bs-example-modal bs-example-modal-bz" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
		  <div class="modal-dialog modal-sm" role="document">
		    <div class="modal-content">
		      <textarea name="" rows="" cols="" placeholder="备注"></textarea>
		      <p class="tishi">
		      	<i class="iconfont icon-gantanhao"></i>
		      	最多可输入300字
		      </p>
		      <a href="javascript:void(0)" class="btn" data-toggle="modal" data-target=".bs-example-modal-bz">确定</a>
		    </div>
		  </div>
		</div>
		
		<!--是否需要发票模态窗-->
		<div class="modal fade bs-example-modal bs-example-modal-p-fp" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
		  <div class="modal-dialog modal-sm" role="document">
		    <div class="modal-content">
		    	<ul class="fp-ul">
		    		<li>
		    			<i></i>
		    			<span>是</span>
		    		</li>
		    		<li>
		    			<i></i>
		    			<span>否</span>
		    		</li>
		    	</ul>
		      <a href="javascript:void(0)" class="btn" data-toggle="modal" data-target=".bs-example-modal-p-fp">确定</a>
		    </div>
		  </div>
		</div>
		
		<!--作品类型模态窗-->
		<div class="modal fade bs-example-modal bs-example-modal-p-worksType" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
		  <div class="modal-dialog modal-sm" role="document">
		    <div class="modal-content">
		    	<ul class="fp-ul">
		    		<li>
		    			<i></i>
		    			<span>工作简历</span>
		    		</li>
		    		<li>
		    			<i></i>
		    			<span>婚恋简历</span>
		    		</li>
		    		<li>
		    			<i></i>
		    			<span>网红同款</span>
		    		</li>
		    	</ul>
		      <a href="javascript:void(0)" class="btn" data-toggle="modal" data-target=".bs-example-modal-p-worksType">确定</a>
		    </div>
		  </div>
		</div>
		
		<!--发票抬头模态窗-->
		<div class="modal fade bs-example-modal bs-example-modal-tt" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
		  <div class="modal-dialog modal-sm" role="document">
		    <div class="modal-content">
		      <ul class="tt-ul clearfix">
		      	<li class="on">个人</li>
		      	<li>公司</li>
		      </ul>
		      <div class="input">
		      	<input type="text" name="" id="" value="" placeholder="公司名称" />
		      	<input type="text" name="" id="" value="" placeholder="纳税人识别号" />
		      </div>
		      <a href="javascript:void(0)" class="btn" data-toggle="modal" data-target=".bs-example-modal-tt">确定</a>
		    </div>
		  </div>
		</div>
		
		<!--收票人模态窗-->
		<div class="modal fade bs-example-modal bs-example-modal-spr" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
		  <div class="modal-dialog modal-sm" role="document">
		    <div class="modal-content">
		      <div class="input">
		      	<input type="text" name="" id="" value="" placeholder="收票人姓名" />
		      	<input type="text" name="" id="" value="" placeholder="收票人电话" />
		      	<input type="text" name="" id="" value="" placeholder="收票人地址" />
		      </div>
		      <a href="javascript:void(0)" class="btn" data-toggle="modal" data-target=".bs-example-modal-spr">确定</a>
		    </div>
		  </div>
		</div>
		
		<!--优惠券模态窗-->
		<div class="modal fade bs-example-modal bs-example-modal-yhq" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
		  <div class="modal-dialog modal-sm" role="document">
		    <div class="modal-content">
		      <div class="top clearfix">
		      	<h3>选择优惠券</h3>
		      	<span>不使用优惠券</span>
		      </div>
		      <div class="bottom">
		      	<i></i>
		      	<img src="images/coupon-img.png"/>
		      </div>
		      <a href="javascript:void(0)" class="btn" data-toggle="modal" data-target=".bs-example-modal-yhq">确定</a>
		    </div>
		  </div>
		</div>
		
		
	    
	    <!--底部版权信息-->
	    <div class="footwrap">
	    	<div class="top clearfix">
	    		<div class="logo">
	    			<img src="images/logo.png" alt="" />
	    		</div>
	    		<div class="text">
	    			<ul class="clearfix">
	    				<li>
	    					<a href="javascript:void(0)">关于录啊</a>
	    				</li>
	    				<li>
	    					<a href="javascript:void(0)">商务合作</a>
	    				</li>
	    				<li>
	    					<a href="javascript:void(0)">常见问题</a>
	    				</li>
	    				<li>
	    					<a href="javascript:void(0)">平台政策</a>
	    				</li>
	    			</ul>
	    		</div>
	    	</div>
	    	<div class="bottom">
	    		<p>津ICP备2021006238号-1  &nbsp;&nbsp;巨桃游娱（天津）信息科技有限公司  &nbsp;&nbsp;</p>
	    	</div>
	    </div>
	    
	    <!--底部导航栏-->
	    <div class="foot-nav">
	    	<dl class="on">
	    		<dt>
	    			<i></i>
	    		</dt>
	    		<dd>
	    			联系
	    		</dd>
	    	</dl>
	    	<dl>
	    		<dt>
	    			<i></i>
	    		</dt>
	    		<dd>
	    			咨询
	    		</dd>
	    	</dl>
	    	<dl>
	    		<dt>
	    			<i></i>
	    		</dt>
	    		<dd>
	    			微信
	    		</dd>
	    	</dl>
	    	<dl>
	    		<dt>
	    			<i></i>
	    		</dt>
	    		<dd>
	    			我的
	    		</dd>
	    	</dl>
	    </div>
	    
	</body>
	<script src="js/jquery.js"></script>
	<script src="js/TouchSlide.1.1.js" type="text/javascript"></script>
	<script src="js/home.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script type="text/javascript">
		TouchSlide({ slideCell:"#focus",titCell:".hd li",mainCell:".bd ul", effect:"left", autoPlay:true,interTime:5000});
	</script>
</html>
